<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        .odiv {
            height: 100px;
            line-height: 100px;
            background-color: #f00;
            direction: rtl;
        }

        .bnt {
            margin-left: 20px;
        }
    </style>
</head>

<body>

    <div class="odiv"><button class="bnt" data-type="1">添加</button><button class="bnt" data-type="2">删除</button></div>
    <!-- <div id="div">
            <div class="div1">div1</div>
            <div class="div2">div2</div>
        </div> -->
    <script>
        //         event.target

        // 　　　　event.target.nodeName  　　//获取事件触发元素标签name（li,p...）

        // 　　　　event.target.id　　　　　　　//获取事件触发元素id

        // 　　　　event.target.className　　//获取事件触发元素classname

        // 　　　　event.target.innerHTML　　//获取事件触发元素的内容（li）
        //        console.log(e.target.dataset.data);

        let obody = document.body
        obody.addEventListener('click', (e) => {
                if (e.target.dataset.type == 1) {
                    e.target.onclick = () => {
                        let cp=e.target.parentNode.cloneNode(true)
                        obody.appendChild(cp)
                    }
                } else {
                    obody.removeChild(e.target.parentNode)
                }


            })
        //--------------------------------------------------------------------------------------------------------------
        // 获取按钮
        // let bnt = document.getElementsByClassName('bnt')
        // bnt[0].onclick=()=>{
        //     let odiv1=document.createElement('div');
        //     odiv1.innerHTML='<div class="odiv"><button class="bnt">添加</button><button class="bnt">删除</button></div>'
        //     document.body.appendChild(odiv1)
        //     let bnt = document.getElementsByClassName('bnt')
        // }
        // ---------------------------------------------------------------------------------------------------------------
        //     window.onload = function(){
        //     let div = document.getElementById('div');

        //     div.addEventListener('click',function(e){
        //         console.log(e.target)
        //     })

        //     let div3 = document.createElement('div');
        //     div3.setAttribute('class','div3')
        //     div3.innerHTML = 'div3';
        //     div.appendChild(div3)
        // }
    </script>
</body>

</html>